<template>
	<view class="partner-join__form-two">
		<view class="e-font-56 fw-600 e-m-b-76">
			{{ $t('store.qxzndzysp') }}
		</view>
		<view class="partner-join__form-two__input e-flex e-flex-between e-p-l-30" @tap="$emit('openPicker')">
			<text :class="[value ? 'c-33' : 'c-secondary']">{{ value || $t('store.qxzlm') }}</text>
			<image src="../../static/arrow.png" class="img-36"></image>
		</view>
		<view class="partner-join__form-two__btn e-flex e-font-32 fw-500">
			<view class="e-flex-1 bg-primary e-font-32 c-white e-flex-xy-center" :style="[boxShadowColor]" @tap="$emit('next')">
				<text>{{ $t('store.xyb') }}</text>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	props: {
		primary: String,
		value: String
	},
	computed: {
		boxShadowColor() {
			return {
				boxShadow: `0 12rpx 24rpx 0 ${this.primary.replace('1)', '0.3')}`
			}
		}
	}
}
</script>

<style lang="scss" scoped>
.partner-join__form-two {
	&__input {
		height: 100rpx;
		border-radius: 8rpx;
		border: 2rpx solid #e2dfe2;
	}
	&__btn {
		padding-top: 110rpx;
		> view {
			height: 100rpx;
			border-radius: 50rpx;
			&:first-child {
				padding: 28rpx 56rpx;
				margin-right: 30rpx;
				border: 2rpx solid var(--color-primary);
			}
			&:last-child {
			}
		}
	}
}
</style>
